<!DOCTYPE html>
<html>
<head>
    {% include 'zbook/common/header.html' %}
    <title>书籍</title>
</head>
<body>
{% include 'zbook/common/topbar.html' %}
<!--小说列表展示内容-->
<div class="container">
    <!--推荐书籍-->
    {% include 'zbook/common/recommend.html' %}
    <!--小说列表-->
    <div class="Fiction species-module">
        <div class="clearfix filter-list  recommend-style">
            {% for book in data.data %}
            <div class="col-sm-6 col-md-2 col-xs-6">
                <div class="thumbnail">
                    <a href="/catalog?bid={{book.id}}" class="clearfix">
                        <div class="thumbnail-img">
                            {% if book.img %}
                            <img data-src="holder.js/100%x200" alt="100%x200" src="{{ book.img }}"
                                 data-holder-rendered="true" style="width: 100%; display: block;">
                            {% else %}
                            <img data-src="holder.js/100%x200" alt="100%x200" src="/_uploads/photos/default_img.png"
                                 data-holder-rendered="true" style="width: 100%; display: block;">
                            {% endif %}
                            {% if book.auth %}
                            <h5 class=" author-name">作者：{{ book.auth|truncate(3, True) }}</h5>
                            {% else %}
                            <h5 class=" author-name">作者： </h5>
                            {% endif %}
                        </div>
                        <div class="caption">
                            <div class="book-title clearfix">
                                <h4 class="navbar-left">《{{ book.name }}》 </h4></div>
                            {% if book.desc %}
                            <p class="recommend-summary">{{ book.desc|truncate(46) }}</p>
                            {% else %}
                                {% if book.auth %}
                                <p class="recommend-summary">《{{book.name}}》作者是{{ book.auth|truncate(7, True) }}，因为本书暂时还没有阅读过，等以后读过再填写书籍的介绍...</p>
                                {% else %}
                                <p class="recommend-summary">《{{book.name}}》 因为本书暂时还没有阅读过，等以后读过再填写书籍的介绍...</p>
                                {% endif %}
                            {% endif %}
                        </div>
                        <span class="recommend-sheets">共 {{ book.sheets }} 章</span>
                    </a>
                </div>
            </div>
            {% endfor %}
        </div>
        <div aria-label="Page navigation">
            <ul class="pagination navbar-right">
                {% for pn in data.page_navs %}
                    {% if pn.name == "first" %}
                        <li><a href="{{pn.href}}" aria-label="Previous"><span aria-hidden="true">&laquo;</span> </a></li>
                    {% elif pn.name == "last" %}
                        <li><a href="{{pn.href}}" aria-label="Next"><span aria-hidden="true">&raquo;</span> </a></li>
                    {% else %}
                        {% if pn.current %}
                        <li class="disabled"><a href="#">{{ pn.name }}</a></li>
                        {% else %}
                        <li class=""><a href="{{pn.href}}">{{ pn.name }}</a></li>
                        {% endif %}
                    {% endif %}
                {% endfor %}
            </ul>
        </div>
    </div>
</div>
{% include 'zbook/common/footer.html' %}
</body>

</html>
<script>
		var topnode = document.querySelector('#header-top');

	function change() {
		var bgheader = document.getElementById('integral-bgheader');
		var y = document.scrollingElement.scrollTop;
		bgheader.style.opacity = (((y / 50) > 0.9) ? 0.9 : (y / 50));
		if(y > 50) {
			topnode.classList.add("headerstyle");
		} else {
			topnode.classList.remove("headerstyle");
		}
	}
	document.addEventListener('touchmove', change);
	document.addEventListener('scroll', change);
	/**************搜索********************/
	function submit_search(){
		var name= $("#search-content").val();
		if(name!=''){
			window.location.href='/list?key='+name+'&page=1&limit=12';
		}else{
			PromptBox('请输入查询信息!',2,false);
		}

	}


</script>